<%--
  Created by IntelliJ IDEA.
  User: jz
  Date: 2022/3/6
  Time: 20:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>神行租车</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/create_order.css">
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/image/smallLogo.svg" type="image/x-icon">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/dist/bootstrap-5.1.3-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/dist/bootstrap-5.1.3-dist/css/bootstrap.css">
    <script src="${pageContext.request.contextPath}/js/jquery-3.6.0.min.js"></script>
    <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
    <script src="${pageContext.request.contextPath}/dist/bootstrap-5.1.3-dist/js/bootstrap.min.js"></script>
</head>
<body>

<%--head登陆注册部分--%>
<div class="login-regist">
    <div class="back">
        <div class="head-left">
            <c:if test="${empty customer}">
                    <span class="login">
                    <a href="${pageContext.request.contextPath}/customer/login.jsp">登陆</a>
                    </span>
                <span>｜</span>
                <span class="regist">
                    <a href="${pageContext.request.contextPath}/customer/regist.jsp">免费注册</a>
                </span>
            </c:if>
            <c:if test="${!empty customer}">
                    <span class="login">
                    欢迎用户 <span style="color: #23b7b7">${customer.memberName}</span>
                    </span>
            </c:if>

            <span>｜</span>

            <c:if test="${empty customer}">
                    <span class="myself">
                        <a href="${pageContext.request.contextPath}/customer/login.jsp">我的一嗨</a>
                    </span>

            </c:if>
            <c:if test="${!empty customer}">
                    <span class="myself">
                    <a href="${pageContext.request.contextPath}/customer/customer_info.jsp">我的一嗨</a>
                    </span>
                <span>｜</span>
                <span class="myself">
                        <a href="${pageContext.request.contextPath}/member/logout">退出登陆</a>
                    </span>
            </c:if>
        </div>
    </div>
</div>
<!--==============================进度条================================-->
<div class="body-progress">
    <div class="progress progress-striped active">
        <div class="progress-bar progress-bar-success progress-color" role="progressbar"
             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
             style="width: 60%;">
        </div>
        <div class="progress-bar " style="width: 40%;background-color:#999999"></div>
    </div>
    <span class="progress-icon-style">1</span>
    <span class="progress-icon-style second">2</span>
    <span class="progress-icon-style third">3</span>
</div>

<!--================================crerate_order_body==============================-->

<%--${orderInfo}--%>
<%--<hr>--%>
<%--${carName}--%>
<%--<hr>--%>
<%--${startDate}--%>
<%--<hr>--%>
<%--${endDate}--%>

<div class="cre_order_body">
    <div class="container">
        <div class="row">
            <div class="col-md-9 col1">

                <!-- -----------------------------图片div -->
                <div class="car-image-box">
                    <img src="${pageContext.request.contextPath}/image/create_order_car.png" alt="">
                    <div class="rent-date">
                        <span>租 期:
                            <span class="day-span">
                                ${orderInfo.carDay}
                            </span>天
                        </span>
                    </div>
                </div>
                <!--           -----------------  --------   订单店铺信息-->
                <div class="store-info-box">
                    <div class="car-name">
                        <p class="revise-back" href="">${carName}</p>
                        <a class="car-info" href="${pageContext.request.contextPath}/car/${orderInfo.carId}">车辆详情</a>
                    </div>
                    <ul class="info">
                        <li>
                            <span>
                                取车地点
                            </span>
                            <span>
                                还车地点
                            </span>
                        </li>
                        <li>
                            <span>取车门店: ${getCarShop}</span>
                            <span>还车门店: ${returnCarShop}</span>
                        </li>
                        <li>
                            <span>取车时间: ${startDate}</span>
                            <span>还车时间: ${endDate}</span>
                        </li>
                        <li>
                            <span>取车地址: ${startAdd}</span>
                            <span>还车地址: ${endAdd}</span>
                        </li>
                        <li>
                            <span>
                                订单说明
                            </span>
                        </li>
                        <li class="rule-toggle">
                            <p>不限公里数，超时费按车辆租赁费及门店服务费均价÷6收取实际超期小时费 (部分0元活动订单，按照40元/小时进行收取)。
                                <a href="" id="rule">退改规则</a>
                            </p>
                        </li>
                        <li class="hint">
                            <p>温馨提示：<a href="">点击阅读限行城市规则</a></p>
                        </li>
                    </ul>
                </div>
                <div class="row">
                    <div class="col-md-12 activity-title">
                        <span>我的优惠券</span>
                    </div>

                </div>

                <!--       ------------------------------------ 优惠活动-->
                <c:forEach items="${mycoupon}" var="list">
                    <c:if test="${list.ownCouponStatus eq 0}">
                        <div class="activity-box">
                            <div class="coupon coupon-wave-left coupon-yellow coupon-box">
                                <div class="coupon-info coupon-hole coupon-info-right-dashed">
                                    <div class="coupon-price">¥${list.ownCouponPrice}</div>
                                    <div class="coupon-desc">${list.ownCouponPrice}元优惠券满${list.ownCouponValidprice}元使用</div>
                                    <div class="coupon-expiry-date">有效期：
                                        <fmt:formatDate value="${list.couponStarttime}" pattern="yyyy-MM-dd"/>-
                                        <fmt:formatDate value="${list.couponEndtime}" pattern="yyyy-MM-dd"/></div>
                                        <%--                                    <div class="coupon-get coupon-get-already ">--%>
                                        <%--                                        <button class="use-button">立即使用</button>--%>
                                        <%--                                    </div>--%>
                                </div>
                                <!-- <div class="coupon-get coupon-get-already">立即使用</div>-->
                            </div>
                        </div>
                    </c:if>
                </c:forEach>
            </div>
            <div class="col-md-3 col2">
                <div class="step2-box-right" id="priceall">
                    <div class="price-title">
                        费用明细
                    </div>
                    <ul class="price-ul">
                        <li class="line-clear" id="baseRatePrice">
                            <p class="text">
                                车辆租赁费:
                            </p>
                            <em class="price-drop">
                                ￥${orderInfo.myorderTotalPrice}
                                <i class="price-drop-open1"></i>
                                <i class="price-drop-close display-fix"></i>
                            </em>
                            <div class="price-drop-box">

                                <c:if test="${!empty mycoupon}">
                                    <c:forEach items="${mycoupon}" var="text">

                                        <c:if test="${text.ownCouponStatus eq 0 && text.ownCouponValidprice <= orderInfo.myorderTotalPrice}">
                                            <a class="own-coupon">
                                                <input type="hidden" value="${text.ownCouponId}"
                                                       class="own_coupon_id ts">
                                                <input type="hidden" value="${text.ownCouponValidprice}"
                                                       class="ownCouponValidprice">
                                                <span class="ts"><fmt:formatDate value="${text.ownCouponTime}"
                                                                                 pattern="yy/MM EE"/></span>
                                                <span class="ts" style="display: inline-block;color: white;">￥</span>
                                                <span class="ts"
                                                      style="display: inline-block">${text.ownCouponPrice}</span>
                                            </a>
                                        </c:if>
                                    </c:forEach>
                                </c:if>
                            </div>
                        </li>
                        <li class="promotionPriceList">
                            <P class="text">优惠价格:</P>
                            <em class="price-drop">
                                ￥<span class="preferential">0</span>
                                <i class="price-drop-open2"></i>
                                <i class="price-drop-close display-fix"></i>
                            </em>
                            <div class="cop">
                                <%--                                                                <span>--%>
                                <%--                                                                    <p>满300减50优惠券</p>--%>
                                <%--                                                                    <p class="orange">￥-50</p>--%>
                                <%--                                                                </span>--%>
                            </div>
                        </li>
                    </ul>
                    <div class="price-box" id="totalAmount">
                        <span class="price-txt" id="priceTitle">
                            总计:
                        </span>
                        <span class="price-total" id="priceTotal">
                        <em>￥</em>${orderInfo.myorderTotalPrice}
                        </span>
                    </div>

                    <div class="price-btnbox">
                        <form method="post" action="${pageContext.request.contextPath}/myorder">

                            <input type="hidden" value="${orderInfo.memberId}" name="memberId">
                            <input type="hidden" value="${orderInfo.getShopId}" name="getShopId">
                            <input type="hidden" value="${orderInfo.returnShopId}" name="returnShopId">
                            <input type="hidden" value="${orderInfo.getCarDate}" name="getCarDate">
                            <input type="hidden" value="${orderInfo.backCarDate}" name="backCarDate">
                            <input type="hidden" value="${orderInfo.carId}" name="carId">
                            <input type="hidden" value="${orderInfo.carDay}" name="carDay">
                            <input type="hidden" value="" name="couponNo" class="couponNo">
                            <input type="hidden" value="${orderInfo.myorderRawprice}" name="myorderRawprice"
                                   class="myorderRawprice">
                            <input type="hidden" value="${orderInfo.myorderTotalPrice}" name="myorderTotalPrice"
                                   class="myorderTotalPrice">
                            <input type="submit" value="提交订单" class="submit-button">

                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<script src="${pageContext.request.contextPath}/js/create_order.js"></script>

<script>

    $(".own-coupon").click(function (event) {
        console.log("开始执行任务")
        var ele = event.target;
        console.log(ele)

        var couponId = ele.parentElement.firstElementChild.value;
        console.log(couponId)

        var couponPrice = ele.parentElement.lastElementChild.innerText;
        console.log(couponPrice)

        var ownCouponValidprice = ele.parentElement.firstElementChild.nextElementSibling.value
        console.log(ownCouponValidprice)

        var border = false;
        var styleList = ele.parentElement.classList;
        for (var i = 0; i < styleList.length; i++) {
            console.log(styleList[i])
            if (styleList[i] == "own") {
                border = true;
            }
        }

        if (border) {
            styleList.remove("own")
            $(".preferential").html("0")

            $(".cop").html("")

            $(".price-total").html(${orderInfo.myorderTotalPrice})

            $(".couponNo").val("");
            $(".myorderRawprice").val('${orderInfo.myorderRawprice}');
            $(".myorderTotalPrice").val(${orderInfo.myorderTotalPrice});


        } else {
            var aParent = ele.parentElement.parentElement;
            var aList = aParent.children;
            for (var i = 0; i < aList.length; i++) {
                console.log(aList[i])
                aList[i].classList.remove("own")
            }
            styleList.add("own")
            $(".preferential").html(couponPrice)

            $(".cop").html('<span> <p>满' + ownCouponValidprice + '减' + couponPrice + '优惠券</p> <p class="orange">￥-' + couponPrice + '</p> </span>')

            $(".price-total").html(${orderInfo.myorderTotalPrice} -couponPrice)

            $(".couponNo").val(couponId);
            $(".myorderRawprice").val('${orderInfo.myorderRawprice}');
            $(".myorderTotalPrice").val(${orderInfo.myorderTotalPrice} -couponPrice);

        }

    })


</script>
</body>
</html>
